Skip to content

fix: stack hero CTA buttons vertically on mobile - #557

Open
ShaikArsalan347 wants to merge 1 commit into
accordproject:mainfrom
ShaikArsalan347:fix/hero-cta
Open

fix: stack hero CTA buttons vertically on mobile#557
ShaikArsalan347 wants to merge 1 commit into
accordproject:mainfrom
ShaikArsalan347:fix/hero-cta

Conversation

@ShaikArsalan347

Copy link
Copy Markdown

Closes #556

Fixes a mobile UI bug where the hero section CTA buttons overlapped
instead of stacking cleanly on narrow viewports.

Changes

  • Added a responsive flex-column layout for .pluginRowBlock at viewports below 768px
  • Removed reliance on inline-block wrapping for the button wrappers; added a defined gap and full-width buttons on mobile for clean vertical stacking

Flags

  • No JS logic changed — this is a CSS-only fix in website/src/css/custom.css
  • Tested locally at ~390px viewport width (Chrome/Edge DevTools);

Screenshots or Video

Before:
image

After:
image

Related Issues

Adds a responsive flex-column layout for the hero section buttons
(Overview, Getting Started, Try Online) at viewports below 768px.
Previously the buttons relied on inline-block wrapping with no
vertical spacing, causing them to overlap on mobile screens.

Fixes accordproject#556

Signed-off-by: shaikarsalan347 <shaikarsalan347@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Mobile: Hero section CTA buttons overlap on narrow viewports

1 participant